If yellow triangle warnings appear in the editor next to any code we provide in any exercise, it is fine to ignore them.

The very basic building block of JavaScript are primitive data types. We know of three primitives:

• strings (e.g. "dogs go woof!")
• numbers (e.g. 4, 10)
• booleans (e.g. false, 5 > 4)

We learned about the use of comparators (eg. >, <=, !==, etc.). One really important thing to note is that any time comparisons are made, a Boolean value is returned.

We know two ways of storing data types. We can use variables or arrays. We use variables to store data (like strings or numbers) that we’d later want to access.

An array is exactly the same as a variable in that it stores data. The difference is that an array can store many more values while a variable can only store one.

To access arrays, we use bracket notation and remember that arrays use 0-based indexing (i.e., the first value in an array is at position 0).

We're going to play a game of FizzBuzz. The rules are simple. We want to count from 1 to 20. But if the number is divisible by 3, we're going to print "Fizz". And if the number is divisible by 5 we're going to print"Buzz".

What will we print if the number is divisible by 3 AND 5? That's right!"FizzBuzz"!

There are many ways to do this, but we'd like you to use a nested conditional in this exercise.

1. Print out the numbers from 1 - 20.
2. The rules:
   • For numbers divisible by 3, print out "Fizz".
   • For numbers divisible by 5, print out "Buzz".
   • For numbers divisible by both 3 and 5, print out "FizzBuzz" in the console.
   • Otherwise, just print out the number.

This exercise has lots of movies and reviews to type in. You might wonder, "Is this teaching coding or typing?!"

But there's a reason why there are so many cases to deal with. We want to show that if we used if-elsestatements, it would be inefficient. What alternative to if / else can we use?

We have discussed four data types: numbers, strings, booleans and arrays.

In this lesson, we focus on a fifth data type: objects. This data type is a little bit more complex. Objects allow us to represent in code real world things and entities (such as a person or bank account). We do this by storing all relevant information in one place—an object.

How do we create an object? Like declaring a variable, or defining a function, we use var, followed by the name of the object and an equals sign. Each object then:

1. starts with {
2. has information inside
3. ends with };
4. 


Let's review what we previously covered. Each piece of information we include in an object is known as aproperty. Think of a property like acategory label that belongs to some object. When creating an object, each property has a name, followed by :and then the value of that property. For example, if we want Bob's object to show he is 34, we'd type in age: 34.

age is the property, and 34 is the value of this property. When we have more than one property, they are separated by commas. The last property does not end with a comma.

See the console for the object I have created about myself. Can you create an object called me that describes your age and which country you live in?

Now that we know how to make objects with properties, let's look at how we actually use them!

Notice our example objects bob andsusan. In this case both bob andsusan each have two properties,name and age.

After creating our objects we have added code to access these properties. Notice that we save bob'sname, "Bob Smith", into the global variable name1. We do this in line 10.

Finish the exercise by filling in the code in lines 13 and 14 to access thename and age for susan and save those into the given global variables.

In the last exercise, we accessed properties using what is known as dot notation. Good name, right? So to access a property, we useObjectName.PropertyName (e.g.,bob.name)

In addition to dot notation, we can also access properties using bracket notation. In this case we useObjectName["PropertyName"] to access the desired property. Note, we need " " around the property's name.

Take a look at our next example object called dog. Notice on line 8 how we save the dog's species into a variable by accessing the species property ofdog using bracket notation.

Use bracket notation to save the dog'sweight and age into variables as well.

The method we've used to create objects uses object literal notation—that is, creating a new object with { }and defining properties within the brackets.

Another way of creating objects without using the curly brackets { }is to use the keyword new. This is known as creating an object using aconstructor.

The new keyword creates an empty object when followed by Object(). The general syntax is:

We've learned how to make objects in two different ways. Both are valid, and you can use which one you prefer.

Let's practice how to use both one more time.

Use literal notation to finish thesnoopy object. Remember literal notation is the one where we fill in {} with separate properties and values with colons. Each property is separated by a comma.

snoopy should have two properties, aspecies of "beagle" and age of 10.

Then make buddy, a 5 year-old golden retriever, using constructor notation. This notation involves using the key word new to create an empty object. Then we fill it in using dot notation

Nice job! Let's do one more example to get the hang of making objects with desired properties.

Create an object named 'bicycle' that has 3 properties:

• a speed of 0
• a gear of 1
• a frame_material of "carbon fiber”

In this lesson we are going to focus onmethods. Methods are an important part of object oriented programming (OOP). OOP is an important part of programming which we'll dive into later.

Methods are similar to functions. To prepare for methods, let's do a quick refresher on functions.
Functions are defined using thefunction keyword followed by:

1. A pair of parentheses ( ) with optional parameters inside.
2. A pair of curly braces with the function's code inside { }.
3. A semicolon ;.

And when we call the function, we can put inputs (arguments) for the parameters.

For example, the square function online 2 takes x as its parameter and returns that parameter squared

In the last section, we discussed properties. We can think of properties as variables associated with an object. Similarly, a method is just like afunction associated with an object.

Let's look at bob, our same person object from the last lesson. Instead of just having the properties name andage (line 3 & 4), bob also has amethod called setAge (line 6). As you can probably guess, this method setsbob's age to whatever argument you give it.

Notice how we define setAge kind of like we define a property. The big difference is that we put in a function after the equals sign instead of a string or number.

We call a method like a function, but we use ObjectName.methodName(). Look at line 10 where we use the method to change bob's age to 40. We did this by callingbob.setAge(40);.

Methods serve several important purposes when it comes to objects.

1. They can be used to change object property values. The method setAgeon line 4 allows us to update bob.age.
2. They can be used to make calculations based on object properties. Functions can only use parameters as an input, but methods can make calculations with object properties. For example, we can calculate the year bob was born based on his age with ourgetYearOfBirth method (line 8).

Our setAge method works great forbob because it updates bob.age, but what if we want to use it for other people?

It turns out we can make a method work for many objects using a new keyword, this. The keyword thisacts as a placeholder, and will refer to whichever object called that method when the method is actually used.

Let's look at the method setAge (line 2) to see how this works. By using the keyword this, setAge will change the age property of any object that calls it. Previously, we had a specific object bob instead of the keywordthis. But that limited the use of the method to just bob.

Then when we say bob.setAge = setAge; (line 9), it means whenever we type bob.setAge( ), this.age in the setAge method will refer tobob.age.

Great! Now we can take advantage of the fact that the method setAge is not limited to a single object bob—we can reuse the same method for different objects! This allows us to avoid typing out a custom method each time. All because we used the placeholderthis.

In the editor, we have the same code as last time, where we define setAgeusing this. We then set bob.setAge = setAge;. But this time we will reuse the setAge method for susan as well.

Make susan on lines 11-13, who should initially have an age of 25 and a susan.setAge method also equal tosetAge.

Then use susan.setAge(35); to setsusan's age to 35.

Let's look at a new example and get practice writing methods.

Here we have defined an objectrectangle starting on line 1. It has a two properties, height and width, which represents the height and width of the shape.

We have written a setHeight method which will update rectangle's heightto the given parameter. This is very similar to setAge from our person example.

Note we have used the keyword this.this is still a placeholder, but in this scenario, this can only ever refer torectangle because we definedsetHeight to be explicitly part ofrectangle by defining it asrectangle.setHeight

Let's look at another method that calculates useful information about an object.

Here we have an object square with asideLength property to represent the length of the square's side. This time, we have added a new method,calcPerimeter, which computes the perimeter of the square. Notice we make use of the keyword return (in the same way we use it in functions!).

We mentioned the term constructorback in section one, when we talked about making an object using the keyword new. A constructor is a way to create an object.

When we write bob = new Object( );we are using a built-in constructor called Object. This constructor is already defined by the JavaScript language and just makes an object with no properties or methods.

This means we have to add our properties one at a time, just like we've been doing. To review, we've created bob using the constructor and defined the name property for you.

But this approach of adding in properties one at a time for every object is tedious! Instead of always using the boring Object constructor, we can make our own constructors.

This way we can set the properties for an object right when it is created. So instead of using the Objectconstructor which is empty and has no properties, we can make our own constructors which have properties.

To see how this works, look at ourPerson constructor in lines 1–4. This constructor is used to make Personobjects. Notice it uses the keywordthis to define the name and ageproperties and set them equal to the parameters given.

Now we can use this constructor to make our good friends bob andsusan in only one line each! Look atlines 7–8: once we have the constructor, it's way easier to make people because we can include theirname and age as arguments to their respective constructors.

Let's look at another example and practice coding constructors. Here we have made a Cat constructor for you, with age and color properties.

Why is this Cat constructor so cool? It means if we have many cats and wanted to create an object for each cat, we could just use this constructor with the properties already defined.

This is much better than using theObject constructor which just gives us an empty object and needs us to define every property and value for each cat object we would create.

In a constructor, we don't have to define all the properties using parameters. Look at our new Personexample on line 1, and see how we set the species to be "Homo Sapiens"(line 4). This means that when we create any Person, their species will be "Homo Sapiens". In this way, the values associated with name and ageare not yet assigned, but species will always have the same value.

In this case, both sally and holdenwill have the same species of "Homo Sapiens", which makes sense because that is the same across all people.

In addition to setting properties, constructors can also define methods. This way, as soon as the object is created it will have its own methods as well.

Here we have a Rectangleconstructor, which sets the heightand width properties equal to the arguments, just like our Person did with name and age.

Notice we have added a calcAreamethod. This calculates the area of the rectangle in terms of its height and width.

Line 11 creates a new object rexwhich makes use of the constructor. You can see how rex calls thecalcArea method in line 12 and saves the result in a variable, area.

Constructors are a way to make objects with the keyword new. The most basic constructor is the Object constructor, which will make an object with no methods or properties.

For more complicated objects we can make our own constructors and put in whatever properties and methods we want.

Check out our example to the right to see objects in action. Our Rabbitconstructor defines an adjectiveproperty and a describeMyself method.

Recall how these kind of custom constructors are important because they allow us to easily make many similar objects.

Remember that an object is just anothertype, like a string or number but more complex. This means that just as we can make arrays of numbers and strings, we can also make arrays of objects.

Here we have our Person constructor which should look familiar. We can use this constructor to make an array ofPerson objects, similar to how we might make an array of numbers but filling in people instead.

Arrays filled with objects will work just like arrays filled with numbers and strings.

In the same way we may loop through an array of numbers to print them out or calculate a sum, we can loop through an array of objects and access properties or methods.

In addition to making arrays of Objects, we can use objects as parameters for functions as well. That way, these functions can take advantage of the methods and properties that a certain object type provides.

To see an example, take a look at the console. In addition to our Personconstructor we have introduced a new function, ageDifference (line 9). This function takes two Person objects as parameters, and returns the difference in age between the two people.

Notice we would be in trouble here if we tried to call ageDifference and passed in strings instead of people, because strings don't have an age property. But because we know from our constructor that allPerson objects will have an ageproperty, we can pass any Person intoageDifference. We must be careful not to pass anything but Person objects intoageDifference.

This time try making your own function that takes objects as parameters!

Here we have given you the Personconstructor again, along with theageDifference function as an example.

Now create a new function, olderAge. It should take two Person objects as parameters, and return the age of whatever Person is older. For example, with 30 year-old alice and 25 year-old bob, olderAge(alice, bob); should return 30, because that is alice's ageand she is older than bob. If the two people have the same age then you can return that age.

Objects provide us with a way to represent real-world or virtual things. We can do this by storing information inside the object's properties. There are two basic ways to make objects:

Literal Notation, where we use

Properties are like variables that belong to an object, and are used to hold pieces of information. Properties can be accessed in two ways:

• Dot notation, withObjectName.PropertyName

• Bracket notation, withObjectName["PropertyName"] (don't forget the quotes!)

In the editor, we have brought back oursnoopy object, with a species and ageproperty

In addition to the basic Objectconstructor, we can define our own custom constructors. These are helpful for two reasons:

1. We can assign our objects properties through parameters we pass in when the object is created.
2. We can give our objects methods automatically.

These both work to save us time and lines of code when we make objects.

Methods are like functions that are associated with a particular object.

They are especially helpful when you want to either:

1. Update the object properties
2. Calculate something based on an object's properties.

Here, we have included a Circle object, with a radius property representing the circle's radius. We have implemented anarea function which calculates the circle's area. Notice we have usedMath.PI to get the π value.